<template>
    <div class="app-container">
        <el-tabs tab-position="top" style="height: 650px ;">
            <el-tab-pane label="基本信息">
                <add-upstream :operate="operate" :upstream="upstreamEntity"/>
            </el-tab-pane>

            <el-tab-pane label="目标服务">
                <upstream-target :upstreamId="upstreamId"/>
            </el-tab-pane>

            <!-- <el-tab-pane label="主动健康检查(Active)">
                <upstream-active :active="upstreamEntity.healthchecks.active"/>
            </el-tab-pane>

            <el-tab-pane label="被动健康检查(Passive)">
                <upstream-passive :passive="upstreamEntity.healthchecks.passive"/>
            </el-tab-pane> -->

        </el-tabs>        
    </div>
</template>
<script>
import {getUpstreamById} from "@/api/kong/upstream.js";
import AddUpstream from './addUpstream.vue';
import UpstreamTarget from './upstreamTarget.vue';
import UpstreamActive from './upstreamActive.vue';
import UpstreamPassive from './upstreamPassive.vue';
export default {
  components: { AddUpstream, UpstreamTarget, UpstreamActive, UpstreamPassive },
    props:{
        upstreamId:{
            type: String,
            required: false,            
        },
        upstreamEntity:{
            type: Object,
            required: false,
            default: null,
        },
    },
    data () {
        return {
            upstream:{},
            operate: "edit",
        }
    },
    created(){
        // console.log("upstreamId:"+this.upstreamId);
        // console.log("upstreamEntity:"+JSON.stringify(this.upstreamEntity))
        this.getUpstream();
    },
    methods:{
        getUpstream(){
            getUpstreamById(this.upstreamId).then(res =>{
                // console.log(JSON.stringify(res));
                this.upstream=res.data
                // console.log(JSON.stringify(this.upstream));
            })
        }
    }
}
</script>
<style lang="stylus" scoped>

</style>